<template>
  <el-dialog
    :model-value="ChangeCar.carDialogVisible"
    :title="t('xuan-ze-che-liang')"
    :before-close="ChangeCar.closeCarDialog"
    :close-on-click-modal="false"
  >
    <template #default>
      <ElSelect
        :model-value="ChangeCar.assistCar"
        :placeholder="t('xuan-ze-che-liang')"
        class="w-full"
        @change="ChangeCar.changeCar"
        @visibleChange="ChangeCar.visibleChange"
      >
        <ElOption v-for="item in carStore.carList" :key="item.id" :value="item.code">
          <span>{{ item.name }}</span>
          <span>{{ item.status === '1' ? '✅' : '🚫' }}</span>
        </ElOption>
      </ElSelect>
    </template>
    <template #footer>
      <el-button type="primary" @click="ChangeCar.confirmIt">{{ t('que-ding') }}</el-button>
    </template>
  </el-dialog>
</template>

<script setup lang="ts">
import { useChangeCar } from '@/composables/useChangeCar'
import { useCarStore } from '@/stores/car'
import { useI18n } from 'vue-i18n'
const carStore = useCarStore()
const ChangeCar = useChangeCar()
const { t } = useI18n()
</script>
